<template>
  <div >
    <div class="fixed-float maxH">
      <div class="fixed-float-select" @mouseover="showMenuItem(1)" @mouseout="hideMenuItem">
<!--        <img src="@/assets/images/side-icon-7.png">-->
        <div v-show=" true" class="hover-mask bbt" @click="openMenuItem(1)">消息提醒</div>
      </div>
      <div class="fixed-float-select" @mouseover="showMenuItem(2)" @mouseout="hideMenuItem">
<!--        <img src="@/assets/images/side-icon-4.png">-->
        <div v-show="true" class="hover-mask bbt"  >在途订单</div>
      </div>

      <div class="fixed-float-select" @mouseover="showMenuItem(3)" @mouseout="hideMenuItem">
<!--        <img src="@/assets/images/side-icon-3.png">-->
        <div v-show="true" class="hover-mask bbt"  @click="openMenuItem(3)">订单记录</div>
      </div>
      <div class="fixed-float-select" @mouseover="showMenuItem(4)" @mouseout="hideMenuItem">
<!--        <img src="@/assets/images/side-icon-5.png">-->
        <div v-show="true" class="hover-mask bbt"  >返回顶部</div>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from 'vue';
// import clickOutSide from "@/directives/clickOutSide.js"; //dom元素加载
// import globalData from "@/public/globalVar.js";
// import _ from "@/utils/lodash";
// import portrait from "./FixedMenuChild/portrait";
// import Recommend from "./FixedMenuChild/Recommend";
// import OrderInTransit from "./FixedMenuChild/OrderInTransit";
// import ServiceView from "./FixedMenuChild/ServiceView";
// import UseView from "./FixedMenuChild/UseView";
// import tagUtil from "@/mixins/tagsUtil";
// import {umpApi} from "@/service/api";
// import { mapGetters, mapMutations } from "vuex";
// import StcSimplePage from "@/components/modules/Pagination/StcSimplePage";
// import  FiveThGenerationDDLOfferDetail from "@/components/views/busi-view/cust/busi/offer-prod-info/5thDDLOfOfferProdInfo/FiveThGenerationDDLOfferDetail.vue"
// import FiveThCxPackageDetail from '../views/busi-view/cust/busi/offer-prod-info/5thCXPackage/FiveThCxPackageDetail';
export default {
  name: "FixedMenu",
  components:{
    // portrait,
    // Recommend,
    // OrderInTransit,
    // ServiceView,
    // UseView,
    // StcSimplePage,
    // FiveThGenerationDDLOfferDetail,
    // FiveThCxPackageDetail
  },
  // props:["custId"],
  // mixins: [tagUtil],
  // directives: { clickOutSide },
  data() {
    return {
      selectCartList:[],
      cartList:[],
      showShoppingCart:false,
      cartAllChecked:false,
      showIndex: 99,
      Shopbol:false,
      showIndex2: [false,false,false,false,false,false,false],
      haveTrue:false,
      quantity:0,//当前暂存单数量
      currentIndex:1, //暂存单当前页
      ddlParam:{},//叠叠乐弹窗参数
      cxParam:{},//智享（畅享）专区参数
    }
  },
  created(){
    // this.queryCartList();
  },
  // mounted(){
  //   //监听刷新暂存单列表命令
  //   let that = this;
  //   this.$root.Bus.$on('refreshTempOrderList',()=>{
  //     that.currentIndex = 1;
  //     that.queryCartList();
  //   })
  //   this.$root.Bus.$on('openDDLDetailDialog',(param)=>{
  //     this.ddlParam={};
  //     this.openMenuItem(6);
  //     this.ddlParam=param;
  //   })
  //   //监听打开智享专区附属商品详情事件，传入详情页面展示参数。
  //   this.$root.Bus.$on('openCXDetailDialog',(param)=>{
  //     this.cxParam={};
  //     this.openMenuItem(7);
  //     this.cxParam=param;
  //   })
  // },
  computed:{
    // ...mapGetters(["getCurrentUser","getAllOfferInsts"]),
    //是否显示ddl图标--主套餐上是否存在叠叠乐附属列表
    isShowDDL(){
      // // 2019-11-06 14:07:59 wangby 增加校验 防止非custIndex组件引用报错
      // if(this.custId){
      //   let allOfferInst=this.getAllOfferInsts(this.custId);
      //   return allOfferInst.some(item=>item.ddlOfferList&&item.ddlOfferList.length>0)
      // }else{
      //   return false;
      // }

    },
    //是否展示畅享专区图标
    isShowCX(){
      // if(!this.custId){
      //   return false;
      // }
      // let allOfferInst=this.getAllOfferInsts(this.custId);
      // return allOfferInst.some(item=>item.cxOfferList&&item.cxOfferList.length>0)
    }
  },
  methods: {
    // ...mapMutations({
    //   cancelOffer: "CANCEL_OFFER",
    //   initTempOrder: "INIT_TEMP_ORDER",
    // }),
    hideFloat(){
      // this.showShoppingCart=false;
      // this.haveTrue=false;
      // this.showIndex2=[false,false,false,false,false,false,false,false];
    },
    openDDlDialog(){
      // if(!this.showIndex2[5]){
      //   this.ddlParam={};
      //   this.openMenuItem(6);
      // }
    },
    openCXDialog(){
      //如果当前畅享专区详情是flase状态 则打开畅享专区详情页面
      //默认直接点击 代表页面没有勾选专区内的附属商品，所以cxParam默认传空
      // if(!this.showIndex2[6]){
      //   this.cxParam={};
      //   this.openMenuItem(7);
      // }
    },
    ShoppingCart(){
      // this.showIndex2=[false,false,false,false,false,false,false];
      // this.haveTrue = false
      // this.Shopbol=!this.Shopbol;
      // this.showShoppingCart=!this.showShoppingCart;
      // if(this.showShoppingCart){
      //   this.queryCartList();
      // }
      // this.triangle(0)
    },
    // 查询暂存单
    queryCartList(){
    },
    deleteCartList(item){
    },
    deleteAllCarts(){
    },
    checkedAll: function(el) {
    },
    gotoCheckoutStand() {
    },
    showMenuItem(index) {
    },
    hideMenuItem() {
    },
    toggleIndexAndBusi(target) {
    },
    // 点击客户首页右侧小图标，显示某一项
    openMenuItem(index) {
    },
    //三角定位
    triangle(_top){
    },
    loadCssCode(code){
    },

    /*暂存单恢复*/

    searchPrevList(){

    },
    searchNextList(){
    }
  },
  destroyed(){
  }
}
</script>

<style scoped>
  .fixed-float {
    width: 60px;
    max-height: 290px;
    background: #ffffff;
    z-index: 999;
    position: fixed;
    right: 0px;
    top: 40%;
    transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    box-shadow: -5px 0px 10px #eeeeee;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    overflow: hidden;
  }
  .fixed-float-select {
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    cursor: pointer;
    position: relative;
  }
  .hover-mask {
    position: absolute;
    background: #339fff;
    top: 0px;
    left: 0px;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 25px;
    word-break: break-all;
    word-wrap: break-word;
    color: #ffffff;
    padding: 6px;
    font-size: 16px;
    display: none;
  }
  .maxH{
    max-height: 350px;
  }

  .nav-count{
    min-width: 15px;
    height: 15px;
    line-height: 15px;
    position: absolute;
    right: 3px;
    top: 7px;
  }
  .hover-mask {
    display: block;
  }
  .aa{
    width: 70%;
    height: 500px;
    background: red;
    right: 50px;
    z-index: 999;
  }
  .bb{
    background: #0C0C0C;
  }
  .scale-enter, .scale-leave-to {
    transform: scale(0)
  }
  .scale-leave, .scale-enter-to {
    transform: scale(1)
  }
  .scale-enter-active, .scale-leave-active {
    transition: all .2s
  }
</style>
